Ext.ns('App.HeadPanel', 'App.ModuleTree', 'App.ModulePanel');

/* --------------------------- HeadPanel: start ------------------------- */

var btnChangePwd = new Ext.menu.Item({
      text    : '忘记密码',
      iconCls : 'lock-go',
      handler : function() {
        var tabPanel = Ext.getCmp('modulePanel');
        var node = new Ext.tree.TreeNode({
              id   : 'retrieve-pwd',
              text : '忘记密码',
              url  : '../../pages/employee/index.html',
              leaf : true
            });

        tabPanel.loadModule(node);
      }
    });

var btnUser = new Ext.SplitButton({
      text    : '用户菜单',
      iconCls : 'user',
      menu    : {
        items : [btnChangePwd, {
              text    : '修改信息',
              iconCls : 'user-edit',
              handler : function() {}
            }]
      }
    });

var btnSys = new Ext.SplitButton({
      text    : '系统菜单',
      iconCls : 'computer',
      menu    : {
        items : [{
              text    : '数据库备份',
              iconCls : 'database-gear'
            }, {
              text    : '偏好设置',
              iconCls : 'wrench'
            }, {
              text    : '帮助',
              iconCls : 'help',
              handler : function() {}
            }]
      }
    });

App.HeadPanel = function() {

  App.HeadPanel.superclass.constructor.call(this, {
        border     : false,
        region     : 'north',
        margins    : '0 0 2 0',
        autoHeight : true,
        items      : [new Ext.Toolbar({
              items : ['&nbsp;&nbsp;', {
                    iconCls : 'calendar'
                  }, '&nbsp;', {
                    xtype : 'label',
                    text  : new Date().format('Y-m-d')
                  }, '&nbsp;&nbsp;', '登录人: 吴可凡  所属部门: 人事', '->', btnUser,
                  btnSys, {
                    text    : '注销',
                    iconCls : 'key-go'
                  }]
            })]
      });
};

Ext.extend(App.HeadPanel, Ext.Panel, {});

/* --------------------------- HeadPanel: end ------------------------- */

/* --------------------------- ModuleTree: start ------------------------- */

App.ModuleTree = function(url) {

  App.ModuleTree.superclass.constructor.call(this, {
        region           : 'west',
        split            : true,
        width            : 280,
        minSize          : 280,
        maxSize          : 500,
        collapsible      : true,
        margins          : '0 0 5 5',
        cmargins         : '0 0 0 0',
        rootVisible      : true,
        lines            : false,
        useArrows        : true,
        autoScroll       : true,
        containerScroll  : true,
        animCollapse     : true,
        animate          : true,
        hideCollapseTool : true,// hide trigger button
        collapseMode     : 'mini',
        loader           : new Ext.tree.TreeLoader({
              requestMethod : 'GET',
              url           : url
            }),
        root             : new Ext.tree.AsyncTreeNode({
              expanded : true,
              text     : '企业应用平台',
              iconCls  : 'monitor',
              id       : 'root'
            }),
        collapseFirst    : false
      });

  this.getSelectionModel().on('beforeselect', function(sm, node) {
        return node.isLeaf();
      });
};

Ext.extend(App.ModuleTree, Ext.tree.TreePanel, {
      initComponent : function() {
        this.hiddenPkgs = [];
        Ext.apply(this, {
              bodyStyle : 'padding:5px',
              tbar      : [' ', new Ext.form.TextField({
                        width           : 200,
                        emptyText       : '请输入关键字 ...',
                        enableKeyEvents : true,
                        listeners       : {
                          render  : function(f) {
                            this.filter = new Ext.tree.TreeFilter(this, {
                                  clearBlank : true,
                                  autoClear  : true
                                });
                          },
                          keydown : {
                            fn     : this.filterTree,
                            buffer : 350,
                            scope  : this
                          },
                          scope   : this
                        }
                      }), ' ', ' ', {
                    iconCls : 'expand-all',
                    handler : function() {
                      this.root.expand(true);
                    },
                    scope   : this
                  }, '-', {
                    iconCls : 'collapse-all',
                    handler : function() {
                      this.root.collapse(true);
                    },
                    scope   : this
                  }]
            })

        App.ModuleTree.superclass.initComponent.call(this);
      },
      filterTree    : function(t, e) {
        var text = t.getValue();
        Ext.each(this.hiddenPkgs, function(n) {
              n.ui.show();
            });
        if (!text) {
          this.filter.clear();
          return;
        }
        this.expandAll();

        var re = new RegExp('^' + Ext.escapeRe(text), 'i');
        this.filter.filterBy(function(n) {
              return !n.attributes.leaf || re.test(n.text);
            });

        // hide empty packages that weren't filtered
        this.hiddenPkgs = [];
        this.root.cascade(function(n) {
              if (!n.attributes.leaf && n.ui.ctNode.offsetHeight < 3) {
                n.ui.hide();
                this.hiddenPkgs.push(n);
              }
            }, this);
      }
    });

/* --------------------------- ModuleTree: end ------------------------- */

/* --------------------------- ModulePanel: start ------------------------- */

MainPanel = Ext.extend(Ext.Panel, {
  closable      : true,
  autoScroll    : true,
  initComponent : function() {
    // Ext.apply(this, {tbar	: [{text	: 'Excel',iconCls	: 'page-excel',handler	: this.commonAction.createDelegate(this, ['xls'])}, {text	: 'PDF',iconCls	: 'page-white-acrobat',handler	: this.commonAction.createDelegate(this, ['pdf'])}, '->', {text	: '打印',iconCls	: 'printer',handler	: function() {}}]}); 

    MainPanel.superclass.initComponent.call(this);
  },
  commonAction  : function(flag) {
    alert('当前动作: ' + flag + '   当前模块: ' + this.title + '\t' + this.id.substr(4))
  }
});

App.ModulePanel = function() {

  App.ModulePanel.superclass.constructor.call(this, {
        id              : 'modulePanel',
        region          : 'center',
        margins         : '0 5 5 0',
        resizeTabs      : true,
        minTabWidth     : 135,
        tabWidth        : 135,
        plugins         : new Ext.ux.TabCloseMenu(),
        enableTabScroll : true,
        activeTab       : 0,
        items           : {
          id         : 'tab-root',
          title      : '企业应用平台',
          iconCls    : 'book',
          autoLoad   : {
            url   : 'welcome.html',
            scope : this
          },
          autoScroll : true
        }
      });
};

Ext.extend(App.ModulePanel, Ext.TabPanel, {
      loadModule : function(node) {
        var title = node.attributes.text;
        var url = node.attributes.url;
        var leaf = node.attributes.leaf;
        if (leaf == 1) {
          var tab = this.getComponent('tab-' + node.id);
          if (!tab) {
            tab = this.add(new MainPanel({
                  id       : 'tab-' + node.id,
                  title    : title,
                  iconCls  : 'table',
                  autoLoad : {
                    url     : url,
                    scripts : true
                  }
                }));
          }

          this.setActiveTab(tab);
        }
      }
    });

/* --------------------------- ModulePanel: end ------------------------- */